require('../css/commCss/normalize.css')
require('../css/commCss/reset.css')
require('../css/commCss/property.css')
require('../css/commCss/basic.css')
require('../libs/iconfont/iconfont.css')
require('../css/sportsDetail.less')

const axios = require('axios')

document.addEventListener('DOMContentLoaded', function () {
    const serUrl = 'http://139.9.177.51:8099'
    let backPage = document.querySelector('#back')
    let fragments = document.querySelector("#fragments")
    // 点击回退按钮返回运动中界面
    backPage.addEventListener('click', function () {
        history.go(-1)
    })
    //获取课程id，并获取数据
    let cid = sessionStorage.getItem('cid')
    let data
    axios.get(serUrl + '/sports/courseDetail?id=' + cid).then(function (res) {
        console.log(res);
        /*
        *渲染数据
        */
        data = res.data.data
        //视频
        document.querySelector("#fragments").src = serUrl + data.fragments[0].videoUrl
        //课程名称
        document.querySelector("#name").textContent = data.name
        //千卡
        document.querySelector("#calorie").textContent = data.calorie
        //分钟
        document.querySelector("#time").textContent = data.time
        //人数
        document.querySelector("#peoplenum").textContent = data.peoplenum
        //头像
        document.querySelector("#imgurl").src = serUrl + data.imgurl
        //描述
        document.querySelector("#desc").textContent = data.desc
        //频次
        document.querySelector("#frequency").textContent = data.frequency
        //器械
        document.querySelector("#instrument").textContent = data.instrument

    })

    //预览视频
    document.querySelector("#play").addEventListener('click', function () {
        fragments.style.zIndex = 2
        fragments.play();
    })
    //暂停视频
    fragments.addEventListener('click', function () {
        fragments.style.zIndex = 0
        fragments.pause();
    })

    //开始训练
    startTrain.addEventListener('click',function(){
        sessionStorage.fragments = JSON.stringify(data.fragments)
        location.href = './courseTraining.html'
    })



})


